<%@page import="java.util.List"%>
<%@page import="coba.service.ProvinciaLocalServiceUtil"%>
<%@page import="coba.service.InstitucionLocalServiceUtil"%>
<%@page import="coba.service.ContactoLocalServiceUtil"%>
<%@page import="coba.service.RecorridoLocalServiceUtil"%>
<%@page import="coba.model.Provincia"%>
<%@page import="coba.model.Institucion"%>
<%@page import="coba.model.Contacto"%>
<%@page import="coba.model.Recorrido"%>
<%@ taglib uri="http://java.sun.com/portlet_2_0" prefix="portlet" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib uri="http://liferay.com/tld/ui" prefix="liferay-ui" %>
<%@ taglib uri="http://liferay.com/tld/aui" prefix="aui" %>

<portlet:defineObjects />

<portlet:renderURL var="listado">
    <portlet:param name="jspPage" value="/views/contacto/listado.jsp" />
</portlet:renderURL>

<portlet:actionURL var="altaContacto" name="altaContacto">
</portlet:actionURL>

<portlet:actionURL var="editarContacto" name="editarContacto">
</portlet:actionURL>

<aui:script>
	var urlInstitucion = null;
	
	var crearUrl = function(path) {
	    var url = new Liferay.PortletURL.createRenderURL();
	    url.setParameter('mvcPath', path);
	    url.setPortletId('agenda_WAR_agendaportlet');
	    url.setWindowState('pop_up');
	    return url;
	};
	
	var abrirPopup = function(id, title, uri) {
		Liferay.Util.openWindow({
			dialog: {
				centered: true,
				after: {
					render: function(event) {
						this.set('y', this.get('y') + 50);
						$(".modal").show();
					}
				},
				width: 1000,
				height: 1000
			},
			id: id,
			title: title,
			uri: uri.toString()
		});
	};
	
	AUI().ready('liferay-portlet-url', function(A) {
	    urlInstitucion = crearUrl('/views/institucion/listado.jsp');
	});
	
	function abrirSeleccionarInstitucion() {
		abrirPopup(
			'<%=liferayPortletResponse.getNamespace() + "instituciones"%>',
			'Instituciones', urlInstitucion
		);
	}

	Liferay.provide(
		window,
		'seleccionarInstitucion',
		function(institucionId, institucionNombre) {
			Liferay.Util.Window
				.getById('<portlet:namespace />instituciones')
				.destroy();

			$('#institucion').val(institucionId);
			$('#institucionNombre').val(institucionNombre);
			$('#institucionNombre').change();
		},
		['liferay-util-window']
	);
</aui:script>

<%
	String laInstitucion = request.getParameter("institucionId");
	Institucion laInstitucionCoso = null;
	if (laInstitucion != null) {
		laInstitucionCoso = InstitucionLocalServiceUtil.getInstitucion(Long.parseLong(laInstitucion));
	}
	
	String elContacto = request.getParameter("id");
	Contacto elContactoCoso = null;
	
	if (elContacto != null) {
		elContactoCoso = ContactoLocalServiceUtil.getContacto(Long.parseLong(elContacto));
		laInstitucionCoso = InstitucionLocalServiceUtil.getInstitucion(elContactoCoso.getInstitucionId());
	}
%>

<div>

	<div class="taglib-header">
		<span class="header-back-to">
			<a class="icon-circle-arrow-left previous-level" href="<%=listado%>" title="Atr&aacute;s">
				<span class="helper-hidden-accessible"> Atr&aacute;s </span>
			</a>
		</span>
		<h3 class="header-title"><span> Contacto </span></h3>
	</div>



	<div>
		<form action="<%=listado%>" method="post" id="formVolver">
			<% if (laInstitucion != null) { %>
				<input type="hidden" name="<portlet:namespace />institucionId" value="<%=laInstitucion%>" />
			<% } %>
		</form>
				
		<form action="<%= (elContacto != null) ? editarContacto : altaContacto %>" method="post" id="formAltaContacto">
			<% if (elContacto != null) { %>
				<input type="hidden" name="<portlet:namespace />id" value="<%=elContacto%>" />
			<% } %>

			<input type="hidden" class="form-control campo" name="<portlet:namespace />institucion" id="institucion" <% if (laInstitucion != null || elContacto != null) out.print("value=\"" + (laInstitucion != null ? laInstitucion : elContactoCoso.getInstitucionId()) + "\""); %>/>
			
			<div class="form-group">
				<label for="<portlet:namespace />apellido">Apellido</label>
				
				<input required maxlength="50" type="text" class="form-control campo" name="<portlet:namespace />apellido" id="apellido" <% if (elContacto != null) out.print("value=\"" + elContactoCoso.getApellido() + "\""); %>>
			</div>
			
			<div class="form-group">
				<label for="<portlet:namespace />nombre">Nombre</label>
				
				<input required maxlength="50" type="text" class="form-control campo" name="<portlet:namespace />nombre" id="nombre" <% if (elContacto != null) out.print("value=\"" + elContactoCoso.getNombre() + "\""); %>>
			</div>
			
			<div class="form-group">
				<label for="<portlet:namespace />telefono">Tel&eacute;fono</label>
				
				<input required maxlength="50" type="text" class="form-control campo" name="<portlet:namespace />telefono" id="telefono" <% if (elContacto != null) out.print("value=\"" + elContactoCoso.getTelefono() + "\""); %>>
			</div>

			<div class="form-group">
				<label for="<portlet:namespace />interno">Interno</label>
				
				<input maxlength="50" type="text" class="form-control campo" name="<portlet:namespace />interno" id="interno" <% if (elContacto != null) out.print("value=\"" + elContactoCoso.getInterno() + "\""); %>>
			</div>

			<div class="form-group">
				<label for="<portlet:namespace />telefono2">Tel&eacute;fono 2</label>
				
				<input maxlength="50" type="text" class="form-control campo" name="<portlet:namespace />telefono2" id="telefono2" <% if (elContacto != null) out.print("value=\"" + elContactoCoso.getTelefono2() + "\""); %>>
			</div>

			<div class="form-group">
				<label for="<portlet:namespace />interno2">Interno 2</label>
				
				<input maxlength="50" type="text" class="form-control campo" name="<portlet:namespace />interno2" id="interno2" <% if (elContacto != null) out.print("value=\"" + elContactoCoso.getInterno2() + "\""); %>>
			</div>
			
			<div class="form-group">
				<label for="<portlet:namespace />email">E-mail</label>
				
				<input required maxlength="50" type="text" class="form-control campo" name="<portlet:namespace />email" id="email" <% if (elContacto != null) out.print("value=\"" + elContactoCoso.getEmail() + "\""); %>>
			</div>
			
			<input type="hidden" name="<portlet:namespace />seguirFiltrando" id="seguirFiltrando">
			
			<div>
				<button type="submit" class="btn btn-primary">Aceptar</button>
			</div>
		</form>
	</div>
	
	<script type="text/javascript">
		var submitted = false;
	    var validator = $.validate("#formAltaContacto",
	    	{ <portlet:namespace />email: { email: true } },
	    	function() { submitted = true; }
	    );
		var validate = function() { if (submitted) validator.form(); }
	
		$("#institucion").select2({ data: instituciones }).change(validate);
		$("#institucionNombre").change(cambioInstitucion);
		
		<%
			if (laInstitucion != null) {
				out.print("$('#seguirFiltrando').val('y dale!');");
			}
		%>
	
	    $('#formAltaContacto').bind('submit', function() {
	        $(this).find(':input').removeAttr('disabled');
	    });
	</script>
</div>